<template>
  <view class="mine">
    <!-- <hunk-head name="马上安家"></hunk-head> -->
    <div class="user-infor">
      <div class="user-head">
        <img :src="userInfo.avatar" alt="" srcset="">
      </div>
      <div class="user-name">
        <div>{{userInfo.unickname}}</div>
        <div class="zuke" v-if="userInfo.usertype==0">
          租客
        </div>
        <div class="manage" v-if="userInfo.usertype==1">
          管理员
        </div>
        <div class="owner" v-if="userInfo.usertype==2">
          业主
        </div>
      </div>
    </div>
    <div class="info-list">
      <div class="info-item">
        <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/userinfo.png'" alt="">
        <div class="item-li" @click="goUserInfo">
          <div class="text">个人信息</div>
          <!-- <div class="icon">></div> -->
          <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
        </div>
      </div>
       <div class="info-item" v-if="userInfo.usertype == 1">
          <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/qb.png'" alt="">
          <div class="item-li">
            <div class="text">所属公寓</div>
            <div class="icon-text">
              <div>{{userInfo.deptname ? userInfo.deptname: ''}} </div>
              <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
            </div>
          </div>
        </div>
      <!-- v-if="userInfo.usertype" -->
      <div class="info-item" v-if="userInfo.usertype == 1 && !userInfo.enterpriseid ">
        <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/home.png'" alt="">
        <div class="item-li" @click="joinQiye">
          <div class="text">我的企业</div>
          <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
        </div>
      </div>

       <div class="info-item"  v-if="userInfo.issettleAccount!=1 &&((userInfo.usertype == 2&&!userInfo.enterpriseid)|| userInfo.usertype == 2)">
          <img class="item-icon" v-if="baseUrl" :src="baseUrl+'tabBarObj/order.png'" alt="">
          <div class="item-li" @click="goCreateCount">
            <div class="text">结算账号</div>
            
            <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
          </div>
        </div>
      
       <div class="info-item" v-if="userInfo.issettleAccount ==1 &&((userInfo.usertype == 2&&!userInfo.enterpriseid)|| userInfo.usertype == 2)">
          <img class="item-icon" v-if="baseUrl" :src="baseUrl+'tabBarObj/order.png'" alt="">
          <div class="item-li" @click="goCreateCount2">
            <div class="text" >结算账号</div>          
           <div>
               <span style="color:#999;margin-right:20px">已创建</span>
            <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">  
           </div>
          </div>
        </div>

      <div v-if="userInfo.usertype">
        <div class="info-item" v-if="userInfo.usertype == 3">
          <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/qb.png'" alt="">
          <div class="item-li">
            <div class="text">收款账号</div>
            <div class="icon-text">
              <div>{{userInfo.telphone}} </div>
              <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
            </div>
          </div>
        </div>
        <div class="info-item" v-if="userInfo.usertype==1">
          <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/boss.png'" alt="">
          <div class="item-li" @click="golaoban">
            <div class="text">成为老板</div>
            <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
          </div>
        </div>
        
      </div>
      
      <!-- <div class="info-item">
        <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/hb.png'" alt="">
        <div class="item-li">
          <div class="text">我的红包</div>
          <div class="icon">></div>
        </div>
      </div> -->
      <div class="info-item">
        <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/about.png'" alt="">
        <div class="item-li">
          <div class="text">常见问题</div>
          <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
        </div>
      </div>
      <div class="info-item">
        <img class="item-icon" v-if="baseUrl" :src="baseUrl+'my/kefu.png'" alt="">
        <div class="item-li noborder" @click="callPhone">
          <div class="text">联系客服</div>
          <img class="icon" v-if="baseUrl" :src="baseUrl+'imgs/imgs/right.png'" alt="" srcset="">
        </div>
      </div>
    </div>
  </view>
</template>

<script>
import Head from '@componentsMine/head'
import { invitehousekeeper } from '@/apis/public'
import {GetUserInfo} from '@/apis/user'
export default {
  data() {
    return {
      phoneNumber:'10081006'
    }
  },
  components: {
    'hunk-head': Head
  },
  computed: {
    userInfo() {
       console.log(this.$store.state.baseStore.userInfo)
      return this.$store.state.baseStore.userInfo

    },
    baseUrl() {
      return process.env.VUE_APP_BASE_IMG_URL;
    }
  },
  created(){
    
  },
  methods: {
    getuserInfo(){
         GetUserInfo({userid:this.userInfo.userid}).then(e=>{
           console.log(e)
         })
    },
    goCreateCount(){
      this.$jump({path: '/subPackage/version2/createCount/index'})
    },
    goCreateCount2(){
      this.$jump({path: '/subPackage/version2/createCount/index2'})
    },
    golaoban(){
      uni.redirectTo({ url: '/pages/login/login' })
    },
    goUserInfo(){
      this.$jump({path: '/pages/my/userinfo'})
    },
    joinQiye(){
      let that = this
      if(!this.userInfo.enterpriseid){
        uni.scanCode({
          success: function (res) {
            console.log('扫码',res)
            that.invitehousekeeper(res.result)
          }
        })
      }else{
        uni.showToast({
          title: '您已经加入企业！',
          icon: 'none'
        })
      }
      
    },
    invitehousekeeper(e){
      let info = JSON.parse(e)
      const data = {
        curuserid: this.userInfo.userid,
        sysdept: info.sysdept,
        userid: info.userid
      }
      invitehousekeeper(data).then(res=>{
        if(res.code == 200){
          uni.showToast({
            title: '邀请成功',
            icon: 'none'
          })
        }
      })
    },
    callPhone(){
      if(this.phoneNumber){
        uni.makePhoneCall({
          phoneNumber: this.phoneNumber,
          // fail: (err)=>{
          //   uni.showToast({
          //     title: '拨打失败，请重新尝试',
          //     icon: 'none'
          //   })
          // }
        })
      }else{
        uni.showToast({
          title: '手机号为空！',
          icon: 'none'
        })
      }
      
    }
  }
}
</script>

<style lang="scss" scoped>
.mine {
  // min-height: calc(100vh - 50px);
  box-sizing: border-box;
 .user-infor{
   width: 100vw;
   height: 123px;
   background: #FFFFFF;
   box-sizing: border-box;
   display: flex;
   align-items: center;
   padding-left: 20px;
   .user-head{
     margin-right: 15px;
     img{
       width: 60px;
       height: 60px;
       border-radius: 50%;
     }
   }
   .user-name{
     div{
       height: 20px;
        font-size: 20px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #000000;
        line-height: 20px;
     }
     .zuke{
       margin-top: 8px;
       width: 50px;
        height: 20px;
        background: rgba($color: #1CDF7C, $alpha: 0.2);
        border-radius: 4px;
        font-size: 14px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #1CDF7C;
        line-height: 20px;
        letter-spacing: 1px;
        text-align: center;
     }
     .manage{
       margin-top: 8px;
      width: 65px;
      height: 20px;
      background: rgba($color: #0090FF, $alpha: 0.2);
      border-radius: 4px;
      font-size: 14px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #0090FF;
      line-height: 20px;
      letter-spacing: 1px;
      text-align: center;
     }
    .owner{
      margin-top: 8px;
      width: 50px;
      height: 20px;
      background: rgba($color: #FFAA58, $alpha: 0.2);
      border-radius: 4px;
      font-size: 14px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #FFAA58;
      line-height: 20px;
      letter-spacing: 1px;
      text-align: center;
    }
   }
 }
 .info-list{
   margin: 10px;
   background-color: #fff;
   .info-item{
     padding: 0 10px;
     display: flex;
     align-items: center;
     .item-icon{
       width: 17px;
       height: 17px;
       margin-right: 14px;
     }
     .item-li{
       flex: 1;
       padding: 14px 0;
       border-bottom: 2px solid #EFEFEF;
       display: flex;
       justify-content: space-between;
       .text{
         font-size: 15px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #4A4A4A;
        line-height: 15px;
       }
       .icon{
        width: 9px;
        height: 15px;
       }
       .icon-text{
         display: flex;
         div{
           font-size: 13px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #979797;
            line-height: 18px;
            margin-right: 5px;
         }
       }
     }
     .noborder{
       border: 0;
     }
   }
 }
}
</style>
